/* start light mode styling */
	:root {
		
		--text: #2c172b;
		--border: rgb(56, 53, 58);
		--accent: rgb(29, 7, 44);
		--bg: #6d5872;
		--gradientTop: white;
		--gradientBottom: rgba(255, 240, 254, 0.8);
	}
	
body {
	padding: 10px;
	font-family: 'MS PGothic', sans-serif;
	color: var(--text);

	/* page background pattern */
	background-color: var(--gradientTop);
	background-image: url("/media/stars.gif");
	background-size: cover;
	background-position: 0 0, 0 0, 10px 18px, 10px 18px, 0 0, 10px 18px;
}
	.container {
	max-width: 66rem;
	margin: 5vw auto 12px auto;
	border: 6px ridge var(--border);
	outline: 3px solid var(--gradientTop);
	outline-offset: 4px;
	border-radius: 10px;
	display: flex;
	flex-wrap: wrap;
	padding: 5px;
	gap: 5px;
	}
	
	/*.crow-sticker {
	position:absolute;
	z-index:5;
	left: 63%;
	bottom: 64.5%;
	}*/

	.crow-sticker {
		position:absolute;
		bottom: -110px;
		right: -40px;
	}

	header {
	background-image: url(/media/pink\ lake.jpg);
	background-color: black;
	background-size: 100%;
	background-repeat:no-repeat;
	background-position:left;
	width: 100%;
	height: 120px; /* change banner height here*/
	border: 2px ridge var(--border);
	border-radius: 5px;
	position: relative;
	}
	

	section-3 {
	border: 2px ridge var(--border);
	border-radius: 5px;
	background:rgba(60, 54, 66, 0.74);
	padding: 5px;
}